<template>
  <div style="background-color: #fff; width: 100%; height: 100%">
    <div class="add-payslip-forth">
      <!-- <a-button icon="left" type="link" @click="$router.go(-1)">返回</a-button> -->
      <div class="content-con">
        <a-result status="success" title="派单成功">
          <template v-slot:extra>
            <a-row type="flex">
              <a-col class="col-left">
                <!-- <img class="img" src="@/assets/img/payslip/Steps-Active.png" alt="失败" /> -->
                <a-icon class="img" type="check-circle" />
                <a-divider class="img-v" type="vertical" />
                <!-- <img class="img" src="@/assets/img/payslip/Steps-Active.png" alt="失败" /> -->
                <a-icon class="img" type="check-circle" />
              </a-col>
              <a-col class="full" style="text-align: left">
                <a-row class="content-con-text mg_b24">
                  <a-col class="mg_b12 round"><strong>派单成功</strong></a-col>
                  <a-col class="sub_tit"> 分公司可通过“社保接单”查看指派人数。</a-col>
                </a-row>
                <a-row class="content-con-text">
                  <a-col class="mg_b12 round">
                    <strong>发送完成 <span class="primary"> 100%</span></strong></a-col
                  >
                  <a-col class="sub_tit">共派单{{ $route.query.num }}人 </a-col>
                </a-row>
              </a-col>
            </a-row>
          </template>
        </a-result>
        <a-button type="primary" @click="goDetail">查看发放详情 </a-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "AddPayslipForth",
  methods: {
    goDetail() {
      this.$router.push({
        path: "/admin/sendSingle"
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.add-payslip-forth {
  padding: 24px;
  .content-con {
    text-align: center;
    padding: 24px 162px;
    .title {
      font-size: 24px;
      font-weight: 600;
      margin-bottom: 12px;
    }
    .content-con-text {
      padding: 24px;
      background: rgba(250, 250, 250, 1);
      border: 1px solid rgba(241, 241, 241, 1);
      border-radius: 4px;
    }
    .col-left {
      padding: 24px;
      .img {
        display: block;
        color: var(--primary);
        font-size: 28px;
        // width: 50px;
        // height: 50px;
      }
      .img-v {
        margin: 24px 0;
        height: 60px;
      }
    }
    .round {
      width: 100%;
      &::after {
        content: "";
        position: absolute;
        left: -12px;
        top: 6px;
        border-radius: 100%;
        border: 2px solid var(--primary);
        width: 8px;
        height: 8px;
      }
    }
  }
}
</style>
